import React from "react";
import {
  Form,
  Table,
  Icon,
  Tag,
  Modal,
  Steps,
  Button,
  message,
  Input,
  Row,
  Col,
  Select,
  DatePicker,
  InputNumber
} from "antd";
import { DropOption } from "components";
import styles from "./index.less";
import bgColor from "../../../assets/test.png";

class ModalSelect extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      current: 0,
      value: "",
      date: "",
      time: "",
      week: ""
    };
  }

  click(test) {
    if (test == 1) {
      window.location = "/file/newfile";
    }
    if (test == 2) {
      window.location = "/total/search";
    }
    if (test == 3) {
      message.warning("暂未开通该功能");
    }
    if (test == 4) {
      message.warning("暂未开通该功能");
    }
  }

  componentDidMount() {
    var now = new Date();
    var year = now.getFullYear(); //年
    var month = now.getMonth() + 1; //月
    var day = now.getDate(); //日

    var hh = now.getHours(); //时
    var mm = now.getMinutes(); //分
    var ss = now.getSeconds();
    var xingqi = now.getDay();
    if (mm < 10) {
      mm = "0" + mm;
    }
    var weekday = [
      "星期日",
      "星期一",
      "星期二",
      "星期三",
      "星期四",
      "星期五",
      "星期六"
    ];
    this.setState({
      date: year + "年" + month + "月" + day + "日",
      week: weekday[xingqi],
      time: hh + ":" + mm
    });
  }

  render() {
    return (
      <Row>
        <Col span={6}>
          <span>用户信息</span>
          <div
            style={{
              marginTop: 20,
              height: 474,
              marginRight:20,
              background: `url(${require("../../../assets/time.png")}) no-repeat`,
              backgroundSize: "100% 100%"
            }}
          >
            {/*<img src={require('../../../assets/index_bg.png')} />*/}
            <ul style={{ margin: "0 40px", fontSize: 20, paddingTop: 30 }}>
              <li style={{color: "white"}}>您好,今天是</li>
              <li style={{color: "white"}}>
                {this.state.date} {this.state.week}
              </li>
              <li style={{ textAlign: "center", fontSize: 80, color: "white" }}>
                {this.state.time}
              </li>
            </ul>
            <div className={styles.box} />
          </div>
        </Col>
        <Col span={18}>
          <span>功能快捷入口</span>
          <div style={{ marginTop: 20 }}>
            <ul style={{ display: "flex", flexWrap: "wrap" }}>
              <li className={styles.listyle} onClick={this.click.bind(this, 1)}>
                <img src={require("../../../assets/first1.png")} />
                <span className={styles.spanstyle}>新增文档</span>
              </li>
              <li className={styles.listyle} onClick={this.click.bind(this, 2)}>
                <img src={require("../../../assets/first2.png")} />
                <span className={styles.spanstyle}>文档检索</span>
              </li>
              <li className={styles.listyle} onClick={this.click.bind(this, 3)}>
                <img src={require("../../../assets/first3.png")} />
                <span className={styles.spanstyle}>文档模板</span>
              </li>
              <li className={styles.listyle} onClick={this.click.bind(this, 4)}>
                <img src={require("../../../assets/first4.png")} />
                <span className={styles.spanstyle}>归档信息</span>
              </li>
            </ul>
          </div>
        </Col>
      </Row>
    );
  }
}

export default Form.create()(ModalSelect);
